| CSS backdrop | 您所在的位置：网站首页 › rotate 函数 › CSS backdrop |
|
CSS backdrop-filter 属性
实例
让元素后面区域添加图形效果: .box { background-color: rgba(255, 255, 255, 0.3); border-radius: 5px; font-family: sans-serif; text-align: center; line-height: 1; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); max-width: 50%; max-height: 50%; padding: 20px 40px; } 尝试一下 » 浏览器支持表格中的数字表示支持该属性的第一个浏览器版本号。 紧跟在 -webkit-, -ms- 或 -moz- 前的数字为支持该前缀属性的第一个浏览器版本号。 属性 backdrop-filter 76 17 103 9.0-webkit- 63 标签定义及使用说明backdrop-filter CSS 属性可以让你为一个元素后面区域添加图形效果（如模糊或颜色偏移）。 因为它适用于元素背后的所有元素，为了看到效果，必须使元素或其背景至少部分透明。 语法 backdrop-filter: 值 描述 none 没有应用于背景的滤镜。 一个以空格分隔的滤镜函数（）或是要应用到背景上的 SVG 滤镜。 /* 关键词值 */ backdrop-filter: none; /* 指向 SVG 滤镜的 URL */ backdrop-filter: url(commonfilters.svg#filter); /* 滤镜函数值 */ backdrop-filter: blur(2px); backdrop-filter: brightness(60%); backdrop-filter: contrast(40%); backdrop-filter: drop-shadow(4px 4px 10px blue); backdrop-filter: grayscale(30%); backdrop-filter: hue-rotate(120deg); backdrop-filter: invert(70%); backdrop-filter: opacity(20%); backdrop-filter: sepia(90%); backdrop-filter: saturate(80%); /* 多重滤镜 */ backdrop-filter: url(filters.svg#filter) blur(4px) saturate(150%); /* 全局值 */ backdrop-filter: inherit; backdrop-filter: initial; backdrop-filter: revert; backdrop-filter: unset; 返回顶部 |
| CopyRight 2018-2019 实验室设备网 版权所有 |